<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="./css/style.css">
    <title>基本数据类型</title>
</head>

<body>

    <div class="box"></div>

    <script src="./js/index.js"></script>
    <!-- 
        1.样式操作：
            通过 js 设置元素的样式；
            常用方法：
                1.el.style.key = `value`; 这种方法 属性名需要使用小驼峰； 这种方式是优先级最高的行内样式！
                2.el.style.cssText = `key1: value1; key2: value2; ...keyn: valuen;` CSS怎么写 这就怎么写；
                3.el.setAttribute('style','key: value')  属性设置；

                4.el.style.setAttribute('key', 'value')  属性设置；
                5.document.styleSheets[0].key = value    样式表数组操作；
                6.更改css的源文件地址 或者 改变元素的类名；

        2.基本数据类型：
            数据：信息世界 万物皆数据！ 数字 图像 视频 音频 文字...都是数据；

            数据类型：
                基本数据类型：
                    1.数值：
                        1.在js中 不用手动定义数值的类型 不同于传统编程语言(C Java...) 可自动区分整型、浮点型数值；
                        2.存在的意义：方便统计、计算；
                        3.如何判断一个变量是否是数字：
                            1.Number.isFinite(变量) 是否为有限数字；
                            2.typeof 变量：判断变量的类型；
                        4.一些特殊的数值：
                            1.科学计数法： 
                                1e + 12 <==> 1 * 10 的 (+)12 次方; 
                                1e - 12 <==> 1 * 10 的 (-12) 次方；
                                可表示极大极小的数值;
                                js可表示的极限值为[5e-324,1.79e+308] 非常大 放心计算；

                                如果数值过大 就会用 ±Infinity 表示；

                                特殊计算：
                                    0 / 0，1 / 0 = Infinity 用的是极限思想；
                            2.NaN：
                                not a number 不是一个数字；
                                一般会出现在数学运算中，如果计算出错或者不应该计算，就会用NaN代替报错；
                                意义：
                                    提示我们，我们正在进行的运算，无法进行数学运算，没有意义；
                                好处：
                                    防止浏览器因为算不出来而崩溃 继而能继续执行后续的代码；
                            3.进制数：
                                1.二进制：  0b 开头 满二进一  0b0011 = 3 (十进制)；
                                2.八进制：  0  开头 满八进一  010 = 8；
                                3.十六进制：0x 开头 满十六进一 0xff = 255;
                                前端一般情况下用不到这些数值；
                            4.js中的计算误差：
                                小数运算会出现误差：
                                    1.0 + 0.2 = 0.30000000000000004； 存在误差；
                                    误差原因：
                                        1.数字存储空间有限；
                                        2.存储也是不精确的，无法准确的保存一个浮点数；
                                    解决办法：
                                        放缩法：(0.1 * 10 + 0.2 * 10) / 10 = 0.3
                                        自定义算法：一般情况下，用不到，而且消耗性能，消耗时间；

                    2.字符串: string
                        1.引号包裹的 都是字符串；
                        2.举例：'墨杉真帅！' 、 "双引号也是字符串！"、'' 、"" 两种空字符串；
                        3.没有单个字符类型 char；

                        4.ES6中的模板字符串：反引号
                            `<p>你好！</p> ${变量}`
                            作用：
                                1.简洁、便利，功能强大；
                                2.可嵌套；
                                3.标签模板，支持函数运行； fn`hello`; 参数是一个类数组对象！
                        5.属性：
                            .length: 返回字符串的长度 就是有多少个字符；
                        6.访问单个字符的方法：
                            下标访问：[0 ~ str.length - 1];

                            let str = '你好世界！';
                            str[0] = '你';
                            str[4] = '!';

                    3.布尔类型：
                        boolean: 逻辑 真 、假 类型；
                            true: 真；
                            false：假；
                        作用：
                            就相当于一个开关，控制着某一种互斥事件的状态！
                            多用于判断、条件、分支、循环等。
                        变量命名建议：
                            使用见名知意的变量名：
                                isMale: 是否为男性；
                                isNumber: 是否为数字...

                    4.undefined：未定义
                        1.声明了变量 但是不给初始值 则变量的值就是undefined；
                        2.访问一个不存在的属性 属性值也是undefined；
                        3.可以显示定义undefined变量 但是内有任何属性访问操作；
                            "dasdas".a.b // "dasdas".a 出错 而不是b出错；

                    5.null：空对象
                        一个不存在的东西；
                        作用：
                            1.用作占位符；
                                已经定义了 但是值不存在 可用null 占位；

                                比如： let obj = null; 创建一个空对象; 后续需要使用对象来替换！
                                如果不用null: let obj; 语意不明，这到底是普通变量还是对象？
                            2.清空一个对象引用；
                                let obj = {x: 1};
                                obj = null; // 关闭访问 清空对象
                        注意：
                            表示一个不存在的对象，对不存在的对象的不存在的属性 直接报错！
                            let obj = null; obj.a = 1; // 直接报错
                引用数据类型：
                    对象： object
                        1.对象是什么：
                            是一种数据结构，可以看成是一种包含各种数据类型和方法的结构体
                        2.对象的书写方式：
                            {
                                key1: value1, 可以是任意数据类型
                                key2: value2,
                                fn: function (){}, // 可以包含函数
                                ...
                            }
                        3.对象属性的访问方式：
                            1.点操作 obj.a obj.fn();
                            2.中括号 obj["字符串"]

     -->
</body>

</html>